<template>
	<view class="order-detail-app">
		<view class="field-image">
			<image class="field-image-item" :src="baseHttp + '/image/getByImageId?imageId=3a745ea9-245b-443c-b30c-19fb1f5058b6'" />
			<view class="field-image-name">合道</view>
		</view>
		<view class="field">
			<view class="title">地址:</view>
			<view class="value">厦门市翔安区永利大厦17层</view>
		</view>
		<view class="field">
			<view class="title">茶室名:</view>
			<view class="value">厦门翔安洋塘永利店</view>
		</view>
		<view class="field">
			<view class="title">房间编号:</view>
			<view class="value">{{item.roomName}}</view>
		</view>
		<view class="field">
			<view class="title">订单编号:</view>
			<view class="value">{{item.orderNO}}</view>
		</view>

		<view class="field">
			<view class="title">开始时间:</view>
			<view class="value">{{item.startTime}}</view>
		</view>
		<view class="field">
			<view class="title">结束时间:</view>
			<view class="value">{{item.endTime}}</view>
		</view>
		<view class="field" v-if="item.money">
			<view class="title">消费金额:</view>
			<view class="value">{{item.money}}元</view>
		</view>
		
		<view class="buttons">
			<button class="btn btn-primary">开大门</button>
			<button class="btn btn-primary">开包厢</button>
		</view>
	</view>
</template>

<script>
	import util from '@/libs/util.js'
  import globalConfig from "@/config";
  const baseHttp = globalConfig.API_HOST

	export default {
		data() {
			return {
				
				payRenewDialog:{
					show: false,
					orderNO: ''
				},
        baseHttp: baseHttp,
				tab: {
					current: null,
					items: [
						{value:null,label:'茶室消费'}
					]
				},
				item: {
					orderNO : "2022011810002",
					teahouseId : "",
					teahouseName : "",
					roomId : "10001",
					roomName : "10001",
					userId : "",
					userPhone : "",
					orderType : "",
					startTime : "2022-01-18 20:00",
					endTime : "2022-01-18 23:00",
					money : "",
					payState : "",
					remark : "",
					rentMins : "",
					predictMoney : ""
				}
			};
		},
		onLoad(e) {	

		},
		onShow() {

		},
		onReachBottom() {

		},
		components: {

		},
		methods: {
			...util,
			getDetail(orderNO) {
				this.$api.post('/roomOrder/getDetail',
				  {
					roomId: orderNo
				  }
				).then((response) => {
				  if (response.ret===1) {
					  this.$nextTick(() => {
					  	order.roomName = response.data.roomName;
						//console.log(order);
					  	this.listData.items[i].roomName = response.data.roomName;
					  	console.log("roomName:"+this.listData.items[i].roomName);
					  })
				
				  } else {
					this.$Message.error(response.msg)
				  }
				});
			},
			goPage(url) {
				uni.navigateTo({
					url: url
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: $uni-bg-color-grey;
	}
	.order-detail-app{
		font-size:32upx;
		padding:50upx;
		background-color: white;
		.field-image{
			display: flex;
			align-items: center;
			margin-bottom:20upx;
			.field-image-item{
				width:200upx;
				height:200upx;
				background-color: #ccc;
				border-radius: 10upx;
			}
			.field-image-name{
				margin-left:50upx;
			}
		}
		.field{
			padding:10upx 0;
			display: flex;
			flex-direction: row;
			.title{width:200upx;color:#999;}
			.value{flex:1;text-align: right;}
		}
		
		.buttons{
			display: flex;
			margin-top:50upx;
			.btn{
				padding:0upx 100upx;
			}
		}
	}

</style>